<template>
  <view class="safe-area-inset-bottom">
    <view class="swip_header">
      <view class="swiplist">
        <swiperTabHead :tabBars="tabList" :tabIndex="tabIndex" @tabtap="tabtap"></swiperTabHead>
        <button size="mini" class="add_btn" @click="handleAdd" v-if="tabIndex == 0">
          <i class="iconfont text-primary">&#xeaf3;</i>新增
        </button>
      </view>
    </view>

    <view class="listTop">
      <!-- 常用签名 -->
      <view v-if="tabIndex == 0">
        <view v-if="sealPersonOftenList != ''">
          <uni-card :is-shadow="false" v-for="(item,index) in sealPersonOftenList" :key="index" @click="toDetail(item)">
            <view style="display: flex;justify-content: space-between;">
              <img :src="'data:image/png;base64,' + item.image" alt="" class="sealImg">
              <uni-icons
                  v-if="item.isSystem == 0 && item.isDefault == 0"
                  type="closeempty"
                  size="18"
                  @click="toDeleteSeal(item)"
              ></uni-icons>
              <view v-if="item.isDefault == 1">
                <uni-tag text="默认印章" type="primary"/>
              </view>
            </view>
            <p class="grid-integral" style="margin-top: 15rpx;font-size: 24rpx;">印章名称：{{ item.name }}</p>
            <p class="grid-integral" style="font-size: 24rpx;">印章编号：{{ item.sealNumber }}</p>
            <p class="grid-integral" style="font-size: 24rpx;">创建时间：{{ parseTimePage(item.createTime) }}</p>
          </uni-card>
        </view>
        <!-- 暂无数据 -->
        <luanqingEmpty :show="true" text="没有更多数据啦" v-else/>
      </view>
      <!-- 不常用签字章 -->
      <view v-if="tabIndex == 1">
        <view v-if="sealPersonNotOftenList != ''">
          <uni-card :is-shadow="false" v-for="(item,index) in sealPersonNotOftenList" :key="index" @click="toDetail(item)">
            <view style="display: flex;justify-content: space-between;">
              <img :src="'data:image/png;base64,' + item.image" alt="" class="sealImg">
              <uni-icons
                  v-if="item.isSystem == 0 && item.isDefault == 0"
                  type="closeempty"
                  size="18"
                  @click="toDeleteSeal(item)"
              ></uni-icons>
              <view v-if="item.isDefault == 1">
                <uni-tag text="默认印章" type="primary"/>
              </view>
            </view>
            <p class="grid-integral">印章名称：{{ item.name }}</p>
            <p class="grid-integral">印章编号：{{ item.sealNumber }}</p>
            <p class="grid-integral">创建时间：{{ parseTimePage(item.createTime) }}</p>
          </uni-card>
        </view>
        <!-- 暂无数据 -->
        <luanqingEmpty :show="true" text="没有更多数据啦" v-else/>
      </view>
    </view>
  </view>
</template>

<script>
import {delSealPerson, listForNotOften, listSealPerson} from "@/api/ec/person/user/sealPerson";
import config from '@/config';
import swiperTabHead from "@/components/slideTab/slideTab";
import luanqingEmpty from '@/components/luanqing-empty/luanqing-empty';
import {parseTime} from "../../../../../utils/ruoyi";

export default {
  components: {luanqingEmpty, swiperTabHead,},
  data() {
    return {
      host: config.baseUrl,
      tabList: [
        {title: '常用签字章'},
        {title: '停用签字章'},
      ],
      // 选项卡编号
      tabIndex: 0,
      // 常用签名列表
      sealPersonOftenList: [],
      // 不常用签名列表
      sealPersonNotOftenList: [],
    }
  },
  onLoad() {
    this.bindingRefreshData();
  },
  onUnload() {
    this.unbindingRefreshData();
  },
  created() {
    this.getSealPersonOftenList();
  },
  methods: {
    /** 绑定 */
    bindingRefreshData() {
      // 刷新页面数据
      uni.$on('refreshSealPersonData', () => {
        this.getSealPersonOftenList();
        this.getSealPersonNotOftenList();
      });
    },
    /** 解除绑定 */
    unbindingRefreshData() {
      uni.$off('refreshSealPersonData');
    },
    /** 日期格式化 */
    parseTimePage(createTime) {
      return parseTime(createTime, '{y}-{m}-{d}  {h}:{i}:{s}');
    },
    /** 查询个人印章 常用印章列表 */
    getSealPersonOftenList() {
      this.$modal.loading();
      listSealPerson().then(response => {
        uni.hideLoading();
        this.sealPersonOftenList = response.data;
      }).catch(() => {
        uni.hideLoading();
      });
    },
    /** 查询个人印章 不常用印章列表 */
    getSealPersonNotOftenList() {
      this.$modal.loading();
      listForNotOften().then(response => {
        uni.hideLoading()
        this.sealPersonNotOftenList = response.data;
      }).catch(() => {
        uni.hideLoading();
      });
    },
    /** 删除签名信息 */
    toDeleteSeal(item) {
      uni.showModal({
        title: '系统提示',
        confirmColor: '#00a660',
        content: '确定要删除 "' + item.name + '" 吗？',
        success: (res) => {
          if (res.confirm) {
            if (item.contractCount > 0) {
              this.$modal.msgError("该签字章已签署过合同，暂时无法删除！")
              return;
            }
            delSealPerson(item.id).then(() => {
              this.getSealPersonOftenList();
              this.getSealPersonNotOftenList();
              this.$modal.msgSuccess("删除成功");
            }).catch(() => {
              this.$modal.msgError("删除失败，请稍后重试！")
            });
          } else if (res.cancel) {
          }
        }
      })
    },
    /** 查看详情 */
    toDetail(item) {
      uni.navigateTo({
        url: './sealPersonDetail?item=' + JSON.stringify(item)
      })
    },
    /** 新增 */
    handleAdd() {
      uni.navigateTo({url: './sealPersonAdd'});
    },
    /** 接受子组件传过来的值点击切换导航 */
    tabtap(index) {
      var _this = this
      _this.tabIndex = index;
      if (_this.tabIndex == 1) {
        _this.getSealPersonNotOftenList()
      } else {
        this.getSealPersonOftenList();
      }
    },
  }
}
</script>

<style lang="scss" scoped>
.sealImg {
  height: 190rpx;
  width: 70%;
  object-fit: contain;
}

.green_btn {
  height: 56rpx;
}
</style>
